<template>
    <panel class="content" title="话题排行" sub="更多">
        <div class="nav">
            <ul>
                <li>
                    <span>1</span>
                    <p>我国燃料电池电动汽车标准体系</p>
                </li>
                <li>
                    <span>2</span>
                    <p>氢能：人类未来的清洁能源</p></li>
                <li>
                    <span>3</span>
                    <p>极限状态下氢的探索</p></li>
                <li>
                    <span>4</span>
                    <p>绿色制氢技术</p></li>
                <li>
                    <span :style="'opacity:' + 0.6">5</span>
                    <p>每车预算170万 山东济南市公交总公司</p>
                </li>
                <li>
                    <span :style="'opacity:' + 0.5">6</span>
                    <p>广州发布新能源车地方补贴标准：</p>
                </li>
                <li>
                    <span :style="'opacity:' + 0.4">7</span>
                    <p>UAE制定氢燃料电池汽车技术法规</p>
                </li>
                <li>
                    <span :style="'opacity:' + 0.3">8</span>
                    <p>氢气的性质及燃料电池备用电源系统中</p>
                </li>
                <li>
                    <span :style="'opacity:' + 0.2">9</span>
                    <p>新能源知识：太阳能转换成氢能</p>
                </li>
                <li>
                    <span :style="'opacity:' + 0.1">10</span>
                    <p>托普索制氢工艺技术经济评价</p>
                </li>
            </ul>
        </div>
    </panel>
</template>

<script>
    import Panel from "../../../core/Panel";

    export default {
        components: {Panel},
        data() {
            return {
            }
        }
    }
</script>

<style scoped lang="scss">
    .content {
        height: 380px;

        .nav {
            padding: 10px;

            li {
                height: 32px;
                font-size: 14px;
                line-height: 32px;
                position: relative;
                cursor: pointer;


                > span {
                    position: absolute;
                    line-height: 16px;
                    font-style: normal;
                    height: 16px;
                    width: 16px;
                    background: #19b955;
                    text-align: center;
                    color: #fff;
                    display: inline-block;
                    top: 8px;
                    font-size: 12px;
                }

                > p {
                    color: #000;
                    margin-left: 25px;
                    @include ellipsis;
                }
            }
        }

        .opacity {

        }

    }


</style>
